import { Progress } from 'antd'
import React, { useEffect, useState } from 'react'
import {useNavigate} from 'react-router-dom'
export default function Guide() {
     //跳转
  const navigate=useNavigate()
  const gotoWhere=(url:string)=>{
      navigate(url)
  }
  //倒计时
  let timer:any=null
  let [num,setNum]=useState<number>(0)
  
  const timeDown=()=>{
    timer=setInterval(()=>{
      if(num<100){
        setNum(num+=1)
      }
      else{
        clearInterval(timer)
        timer=null
        gotoWhere('/login')
      }
    },100)
  }

  useEffect(()=>{
    timeDown()
    //跳转后销毁
    return()=>{
      clearInterval(timer)
      timer=null
    }
  },[])
  return (
    <div style={{height:"100%",width:"100%"}}>
        <img style={{height:"100%",width:"100%"}} src={require('../../assets/images/main.png')} alt="" />
        <div
        style={{cursor: 'pointer',position:"absolute",right:"0.1rem",top:"0.1rem"}}
        onClick={()=>gotoWhere('/login')}
        >
            <Progress type="circle" percent={num} width={70}/>
        </div>
    </div>
  )
}
